body {
  font-size: 14px;
}

video::-internal-media-controls-download-button {
  display:none;
}

video::-webkit-media-controls-enclosure {
  overflow:hidden;
}

video::-webkit-media-controls-panel {
  width: calc(100% + 30px); /* Adjust as needed */
}

.btn, .input-group .input-group-btn .btn {
  border-width: 1px;
}

.webui-popover i.icon-refresh {
  background: none !important;
}

.modal-confirm-message {
  font-size: 16px;
  margin: 10px 0;
}

.actions-bar {
  margin-bottom: 10px;
}

.search-form .input-group input[type=text] {
  width: 100%;
}
.search-form .input-group-btn .fa {
  line-height: 20px;
}

.nav-async-tasks-bar .fa-bars {
  font-size:24px;
  vertical-align:middle;
}
.ace-nav>li .nav-async-tasks-bar .badge {
  position:absolute;
  top:5px;
  left:auto;
  right:5px;
  background-color:red !important;
  padding:0;
  width:15px;
  height:15px;
  line-height:15px;
  font-size:10px;
}

.select2-container--default .select2-selection--single {
  height: 34px;
  border-radius: 0;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 34px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 34px;
}

.status.bordered {
  border-width: 2px;
  border-style: solid;
  padding: 2px 10px;
}
.status-pending, .status-withdrawing {
  color: orange;
  border-color: orange;
}
.status-paid {
  color: #5cb85c;
  border-color: #5cb85c;
}

.required {
  color: red;
  margin-left: 3px;
}

.link-buttons {
  padding: 5px;
  background: #f9f9f9;
}
.link-buttons > a {
  display: inline-block;
  margin: 0 10px;
}

.pager {
  text-align: right;
}
.pager .pager-summary {
  display: inline-block;
  vertical-align: middle;
}
.pager .pager-summary em {
  font-style: normal;
  font-weight: bold;
}
.pager .page-input {
  padding: 2px;
  margin: 0 4px;
  text-align: center;
}
.pager .pagination {
  margin: 0 0 0 10px;
  vertical-align: middle;
}

.loading-panel {
  color: #ddd;
  font-size: 18px;
  text-align: center;
  padding: 50px 0;
}
.loading-panel .fa {
  font-size: 46px;
}

.no-record {
  text-align: center;
  padding: 50px 0;
}
.no-record .no-record-icon {
  font-size: 60px;
  color: #ddd;
}
.no-record .no-record-text {
  color: #aaa;
  margin-top: 10px;
}

.form-control-static {
  padding-top: 4px;
}

.btn-pending, .btn-pending:focus {
  background-color: #ffb752 !important;
  border-color: #ffb752;
}
.btn-pending:hover {
  background-color: #e59729 !important;
  border-color: #ffb752;
}
.btn-paid, .btn-paid:focus {
  background-color: #87b87f !important;
  border-color: #87b87f;
}
.btn-paid:hover {
  background-color: #629b58 !important;
  border-color: #87b87f;
}
.btn-closed {
  background-color: #abbac3!important;
  border-color: #abbac3;
}
.btn-closed:hover {
  background-color: #8b9aa3!important;
  border-color: #abbac3;
}

.btn-group>.btn {
  border-width: 0;
}
.btn-group>.btn>.caret, .btn-group>.btn.btn-xs>.caret {
  margin-top: 0;
}

.field-validation-error {
  color: red !important;
}

.popover {
  max-width: 400px;
}

.nav-pills > li > a {
  padding: 7px 12px 8px;
}
.nav-pills-sm > li > a {
  padding: 4px 12px;
}

.label-sm {
  height: 17px;
}

#view-chapter-modal .chapter-content p {
  font-size: 14px;
  line-height: 1.7em;
}

.bill-detail {
  border: #ddd 1px solid;
  padding: 10px;
}
.bill-detail label {
  font-size: 14px;
  font-weight: bold;
}
.bill-detail .value {
  font-size: 16px;
  margin: 10px 0;
}
.bill-detail .amount {
  color: #00a0e9;
  font-size: 32px;
}
.bill-detail .bill-cell {
  padding: 10px;
}
.bill-detail .remark-lines {
  line-height: 1.7em;
  color: #666;
}
.bill-detail .bill-bank-info {
  line-height: 1.7em;
}
.bill-detail .bill-bank-info label {
  margin-right: 5px;
}
.bill-detail .status {
  font-size: 32px;
  display: inline-block;
  margin-bottom: 10px;
}

.bill-detail .pay-money-status {
  font-size: 12px;
  margin-left: 10px;
  display: inline-block;
  margin-bottom: 10px;
  border-width: 2px;
  border-style: solid;
  padding: 2px 10px;
  color: #ff0008;
  border-color: #ff0008;
}

/* Template Message */
.template-msg-editor {
  border: #ddd 1px solid;
  border-radius: 4px;
  padding: 8px;
  background: white;
  width: 400px;
}
.template-msg-title {
  font-weight:bold;
}
.template-msg-meta {
  color: #999;
  font-size: 12px;
}
.template-msg-main {
  margin: 10px 0 5px;
  font-size: 13px;
  line-height: 1.7em;
  vertical-align: middle;
}
.template-msg-main .btn-edit {
  color: red;
  cursor: pointer;
}

/* Rich msg */
.rich-msg-editor {
  border: #ddd 1px solid;
  border-radius: 4px;
  padding: 8px;
  background: white;
  width: 400px;
}
.rich-msg-editor .msg-title {
  font-weight:normal;
  font-size: 16px;
}
.rich-msg-editor .msg-meta {
  color: #999;
  font-size: 11px;
  margin: 5px 0 7px;
}
.rich-msg-editor-main {
  margin: 10px 0 5px;
  font-size: 13px;
  line-height: 1.7em;
  vertical-align: middle;
}
.rich-msg-editor-main .btn-edit {
  color: red;
  cursor: pointer;
}
.rich-msg-editor .msg-cover-img {
  width: 100%;
}
.rich-msg-editor .msg-edit-pic-overlay {
  display: none;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  text-align: center;
  line-height: 170px;
  background: rgba(0,0,0, .2);
}
.rich-msg-editor .btn-edit-pic {
  cursor: pointer;
  display: inline-block;
  margin-top: 85px;
}
.rich-msg-editor .msg-cover:hover .msg-edit-pic-overlay {
  display: block;
}
.rich-msg-editor .msg-footer {
  font-size: 13px;
  margin-top: 10px;
  border-top: 1px solid #eee;
  padding: 8px 0 0;
}
.rich-msg-editor .msg-footer .fa-chevron-right {
  display: inline-block;
  margin-top: 4px;
  color: #ccc;
  font-weight: 300;
}

.msg-sub-items {
  margin-top:6px;
}
.msg-sub-item {
  border-top:1px solid #eee;padding:6px 0;
}
.msg-sub-item .msg-sub-item-img {
  position:relative;width:40px;height:40px;
}
.msg-sub-item .msg-sub-item-img img {
  width:40px;height:40px;
}
.msg-sub-item .msg-sub-item-img-overlay {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,.3);
  text-align:center;
  line-height:40px;
  display: none;
}
.msg-sub-item .msg-sub-item-img-overlay > a {
  font-size:12px;color:#fff;
}
.msg-sub-item .msg-sub-item-img:hover .msg-sub-item-img-overlay {
  display: block;
}
.msg-sub-item .msg-sub-item-meta {
  margin-top:6px;font-size:12px;color:#ccc;
}

.add-sub-item-panel {
  text-align:center;
  width:400px;
  margin-top:10px;
}
.add-sub-item-panel > a {
  display:block;
  line-height:2em;
  font-size:16px;
}

.bootstrap-tagsinput {
  width: 100%;
  height: 100px;
}
.bootstrap-tagsinput input {
  border: 0px;
}

.twitter-typeahead {
  width: 100%;
  display: block !important;
}

.typeahead,
.tt-query,
.tt-hint {
  width: 396px;
  height: 30px;
  padding: 8px 12px;
  line-height: 30px;
  border: 2px solid #ccc;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  outline: none;
}

.typeahead {
  background-color: #fff;
}

.typeahead:focus {
  border: 2px solid #0097cf;
}

.tt-query {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-input {
  width: 100%;
}

.tt-hint {
  color: #999
}

.tt-menu {
  width: 422px;
  margin: 12px 0;
  padding: 8px 0;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
  -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
  box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.tt-suggestion {
  padding: 3px 10px;
  font-size:14px;
  line-height: 1.8em;
}

.tt-suggestion:hover {
  cursor: pointer;
  background-color: #eee;
}

.tt-suggestion.tt-cursor {
  color: #fff;
  background-color: #0097cf;

}

.tt-suggestion p {
  margin: 0;
}

#member-migrate-modal form.member-migrate-form{
  border-top: 1px solid #e4e9ee;
  margin-top: 15px;
  padding-top: 20px;
}

#app-stats-summary-panel .summary {
  font-size:32px;
  margin:5px 0
}

#app-stats-summary-panel .text-muted {
  font-size:12px;
}

label.checkbox-toggle > input {
  display: none;
}
label.checkbox-toggle i {
  display: inline-block;
  padding: 2px;
  width: 40px;
  height: 20px;
  border-radius: 13px;
  vertical-align: middle;
  -webkit-transition: .25s .09s;
  transition: .25s .09s;
  position: relative;
  background: #d8d9db;
  -webkit-box-sizing: initial;
  box-sizing: initial;
}
label.checkbox-toggle i:after {
  content: " ";
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  left: 2px;
  -webkit-transition: .25s;
  transition: .25s;
}
label.checkbox-toggle > input:checked + i {
  background: #4bd865;
}
label.checkbox-toggle > input:checked + i:after {
  -webkit-transform: translateX(20px);
  transform: translateX(20px);
}
label.checkbox-toggle:hover {
  cursor: pointer;
}

.img-link {
  border: #ddd 2px solid;
  display: inline-block;
}
.img-link-active {
  border-color: #428bca;
}
#rich-msg-setting-list-panel .msg-main-item {
  position: relative;
}

#rich-msg-setting-list-panel .msg-main-title {
  position: absolute;
  opacity: 0.6;
  background-color: #000;
  bottom: 0px;
  color: #fff;
  width: 100%;
}

#rich-msg-setting-list-panel .title {
  padding: 5px;
}

#rich-msg-setting-list-panel .panel-heading {
  background-color: #fff
}

#rich-msg-setting-list-panel .panel-body {
  background-color:#f5f5f5;
  padding:10px;
}

#rich-msg-setting-list-panel .panel-body .well {
  background-color:#fff;
  padding:10px;
  margin-bottom:0px;
}

#rich-msg-setting-list-panel .panel-body .description {
  margin-bottom: 10px
}

#rich-msg-setting-list-panel .panel-footer .nav {
  width:60px;
}

#rich-msg-setting-list-panel .panel-footer .nav>li>a {
  padding:0px;
}

#sidebar li {
  font-size: 13px;
}


#sidebar .nav-list>li>ul {
  background-color:#FFF;
  margin-left: 0;
}

#sidebar .nav-list>li>ul>li {
  border-top: 1px solid #e5e5e5;
}

#sidebar ul.collapse>li.active:after  {
  display: block;
  content: "";
  position: absolute;
  right: -2px;
  top: -1px;
  bottom: 0;
  z-index: 1;
  border: 2px solid;
  border-width: 0 2px 0 0;
  border-color: #2b7dbc;
}

#sidebar ul.collapse>li>a {
  color: #585858;
}

#sidebar ul.collapse>li:hover>a, #sidebar ul.collapse>li.active>a {
  color:#2b7dbc !important;
}

#sidebar .nav-list>li>ul>li>a {
  padding-left: 35px;
}

#sidebar .nav-list>li>ul>li:hover {
  font-size: 13px !important;
  background-color: #FFF !important;
}

.new-feature-hint {
  display: none;
  color: red;
  position: absolute;
  left: 4px;
  top: 4px;
  border-radius: 4px;
  width: 8px;
  height: 8px;
  background: red;
}

.sub-nav .new-feature-hint {
  left: 28px;
  top: 6px;
}